@extends('admin.base')
@section('content')
    <style>
        .table-header-fixed {
            top: 0;
            position: fixed;
            z-index: 9999999;
        }
        .layui-input-250 {
            width: 250px;
        }
        .layui-input-550 {
            width: 250px !important; /* 强制覆盖 */
        }
    </style>

    <link rel="stylesheet" href="/css/public.css" media="all">
    <link rel="stylesheet" href="/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/lib/jq-module/zyupload/zyupload-1.0.0.min.css" media="all">
    <div class="layui-card">
        <legend>&nbsp;</legend>
        <div style="margin: 10px 10px 10px 10px;">
            <div style="margin: 10px 10px 10px 10px;">
                <div class="layui-inline">
                    <label class="layui-form-label">客户名称</label>
                    <div class="layui-input-inline">
                        <input type="text" id="yao_supplier_name" name="yao_supplier_name" autocomplete="off" class="layui-input layui-input-250">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">药天下类型</label>
                    <div class="layui-input-inline">
                        <select name="ytx_code" id="ytx_code" lay-verify="required" lay-search="" class="layui-input layui-input-550">
                            <option value="">--请选择--</option>
                            @foreach($fieldArr as $item)
                                <option value="{{ $item['ytx_code']}}">{{ $item['ytx_subject']}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <div class="layui-inline">
                        <label class="layui-form-label">日期</label>
                        <div class="layui-input-inline">
                            <input type="text" id="date" name="date" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>



                <div class="layui-inline">
                    <button type="submit" class="layui-btn layui-btn-primary" id="Search"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                </div>
            </div>
        </div>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button class="layui-btn layui-bg-blue layui-btn-sm " layEvent="add" id="store"> 同步 </button>

                <button class="layui-btn layui-btn-danger layui-btn-sm " layEvent="add" id="execute"> 生成凭证 </button>
            </div>

        </script>

        <div class="layui-card-body">
            <table id="dataTable" lay-filter="dataTable"></table>
            <script type="text/html" id="options">
                <div class="layui-btn-group">
                    <a class="layui-btn layui-btn-sm" lay-event="approval">审批</a>
                    <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
                </div>
            </script>
        </div>
    </div>
@endsection

@section('script')
    @can('supplier.manage')
        <script src="/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
        <script>

            layui.use(['layer', 'table', 'form', 'upload', 'element'], function () {
                var layer = layui.layer;
                var form = layui.form;
                var table = layui.table;
                var upload = layui.upload;
                var element = layui.element;
                //日期

                layui.use('laydate', function() {
                    var laydate = layui.laydate;
                    laydate.render({
                        elem: '#date', // 绑定的元素选择器
                        type: 'month', // 类型为年月选择器
                        format: 'yyyy-MM', // 格式化输出为年月格式
                        change: function(value, date, endDate) { // 监听日期切换
                            $('#yearMonthSelector').val(value); // 更新输入框的值
                        }
                    });
                });

                $(".layui-table").find('td').data('edit', false);
                // 用户表格初始化
                var dataTable = table.render({
                    elem: '#dataTable',
                    url: '{{ route('admin.supplier.material.approval.data') }}',
                    toolbar: '#toolbarDemo',
                    defaultToolbar: ['exports', 'print', {
                        title: '提示',
                        layEvent: 'LAYTABLE_TIPS',
                        icon: 'layui-icon-tips'
                    }],
                    page: true, // 开启分页
                    cols: [[
                        {type: 'checkbox', fixed: 'left'},
                        {field: 'id', title: 'ID'},
                        {field: 'yao_supplier_name', title: '采购客户'},
                        {field: 'kd_subject', title: '类型'},
                        {field: 'tax_excluded_amount', title: '无税金额'},
                        {field: 'tax_amount', title: '税额'},
                        {field: 'tax_included_amount', title: '含税金额'},
                        {field: 'auxiliary_calculation', title: '辅助核算'},
                        {field: 'jin_supplier_code', title: '金蝶编码'},
                        {field: 'jin_supplier_code', title: '匹配状态', templet: function (d) {
                            if (d.jin_supplier_code != 0) {
                                return '已匹配';
                            } else {
                                return '<span style="color: red;">未匹配</span>';
                            }
                        }},
                        {field: 'data_time', title: '日期'},

                        // {field: 'je_code', title: '凭证号'},
                        {fixed: 'right',title: '操作', align:'center',width: 80, templet: function(d){
                                // 根据条件隐藏编辑按钮
                                // if (d.status == 1) {
                                //     return '<a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="generate">生成凭证</a>' +
                                //         '<a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="edit">修改</a>';
                                // }else{
                                //     return '<a class="layui-btn layui-btn-danger layui-btn-sm" style="background-color: #4CAF50; border-color: #4CAF50;"  >已生成</a>';
                                // }
                                return '<a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="edit">修改</a>';

                        }}

                    ]],
                    done: function () {
                        var storeButton = $("#store");
                        if (storeButton.length === 0) {
                            console.error('未找到添加按钮元素');
                        } else {
                            storeButton.click(function () {
                                layer.confirm('确定生成吗？', function (index) {
                                    $.post("{{ route('admin.supplier.generate.data') }}", {}, function (result) {
                                        if (result.code == 0) {
                                            layer.close(index);
                                            var obj = table.reload('dataTable');
                                        }
                                        layer.msg(result.msg, { icon: 6 });
                                    });
                                });
                            });
                        }

                        $("#execute").click(function () {
                            var index = layer.open({
                                title: '选择凭证类型',
                                type: 2,
                                shade: 0.2,
                                maxmin: true,
                                shadeClose: true,
                                area: ['70%', '70%'],
                                content: "{{ route('admin.supplier.generate.select') }}",
                            });
                        });


                    },
                });



                // 监听搜索操作
                $("#Search").click(function () {
                    var yao_supplier_name = $("#yao_supplier_name").val();
                    var ytx_code = $("#ytx_code").val();
                    var date = $("#date").val();

                    dataTable.reload({
                        where: { yao_supplier_name: yao_supplier_name,ytx_code:ytx_code,date:date },
                        page: { curr: 1 }
                    });
                });

                // 监听搜索操作
                form.on('submit(data-search-btn)', function (data) {
                    var data = data.field;
                    //执行搜索重载
                    table.reload('currentTableId', {
                        page: {
                            curr: 1
                        }
                        , where: {
                            searchParams: data
                        }
                    }, 'data');

                    return false;
                });

                // 监听工具条
                table.on('tool(dataTable)', function (obj) {
                    var data = obj.data;
                    var layEvent = obj.event;
                    if (layEvent === 'generate') {
                        layer.confirm('确认生成凭证吗？', function (index) {
                            $.post("{{ route('admin.supplier.generate.certificate') }}", { id: data.id}, function (result) {
                                if (result.code == 0) {
                                    obj.del();
                                }
                                layer.close(index);
                                layer.msg(result.msg, { icon: 6 });
                            });
                        });
                    }else if(layEvent === 'edit') {
                        var index = layer.open({
                            title: '修改',
                            type: 2,
                            shade: 0.2,
                            maxmin: true,
                            shadeClose: true,
                            area: ['70%', '70%'],
                            content: "{{ route('admin.supplier.generate.edit') }}?id="+data.id,
                        });
                    }
                });



            });
        </script>
    @endcan
@endsection